<template>
<view :style="theme" class="page">
	<!-- 头部组件 -->

	<view class="d-kuan">
		<view class="d-neikuang-10">
			<view class="d-kuan d-beijing-bai d-yuanjiao-10">
				<view class="d-neikuang-10">
					<!--view class="">
						<view class="d-zuo d-xia-10 d-jiacu">圈子</view>
					</view-->
					<view class="d-clear"></view>
					<!--圈子-->
					<view v-if="quanlist.length">
						<view class="d-clear"></view>
						<view class="d-beijing-hui-f6 d-yuanjiao-10 d-xia-10" v-for="(items, indexd) in quanlist" :key="indexd">
							<view class="d-neikuang-10 d-buhuanhang" @click="()=>quanzi(items.id)">
								<view class="d-kuan-40">
									<image :src="items.tubiao" class="d-img-40" ></image>
								</view>
								<view class="d-kuan d-zuo-10">
									<view class="d-jiacu d-wenzi-hei">{{items.title}}</view>
									<view class="d-wenzi-12 d-wenzi-yanse-hui">帖子：{{items.tieshu}}</view>
								</view>
								<view class="d-kuan-100">
									<view class="d-shang-10 d-neirong-juzhong d-hanggao-25 d-wenzi-yanse-bai d-wenzi-14 d-beijing-hei d-yuanjiao-50 d-kuan-50 d-gao-26">浏览</view>
								</view>
							</view>
						</view>
						<view class="d-clear"></view>
					</view>
					<view v-else>
						<u-empty
							mode="data"
							:icon="guanzhutu"
						>
						</u-empty>
						<view class="d-kuan d-neirong-juzhong"> 
							<view class="d-shang-20 d-wenzi-yanse-hongse">您还没有加入任何圈子</view>
							
						</view>
						<u-row customStyle="margin-bottom: 10px" gutter="20" >
							<u-col span="6">
								<view class="demo-layout bg-purple-light d-neirong-juzhong" @click="chuangjian()">
									<u-button   color="linear-gradient(to right, rgb(17, 210, 181), rgb(117, 213, 207))">
										<u-icon name="plus-circle" color="#ffffff" labelColor="#ffffff" size="28" label="去创建一个吧"></u-icon> 
									</u-button>
									
								</view>
							</u-col>
							<u-col span="6">
								<view class="demo-layout bg-purple d-neirong-juzhong" @click="jiaru()">
									
									<u-button color="linear-gradient(to right, rgb(17, 210, 181), rgb(157, 139, 213))">
										<u-icon name="plus-circle" color="#ffffff" labelColor="#ffffff" size="28" label="去加入一个吧"></u-icon> 
									</u-button>
								</view>
							</u-col>
						</u-row>
					</view>
					
				</view>
			</view>
		</view>
	</view>

</view>
</template>

<script>
import toubu from "@/components/toubu/toubu";  //引入头部组件
import config from "../../utils/config";
var Api = require("../../utils/api.js");
var util = require("../../utils/util.js");

var wxApi = require("../../utils/wxApi.js");
var wxRequest = require("../../utils/wxRequest.js");
var webSiteName = config.getWebsiteName;
var domain = config.getDomain;

export default {
  data() {
    return {
      text: "我加入的圈子",
      categoriesList: {},
      floatDisplay: "none",
      userInfo: {},
      webSiteName: webSiteName,
      domain: domain,
	  www: [],
	  quanlist: [],
	  quanid:'',
	  uid:'',
	  keycode:'',
	  tiezileixingquan: 0,
	  guanzhutu:config.getDomain+'/static/default/web/img/data.png',
	  fenggeyanse:''
    };
  },

  components: {
	  toubu,
  },
  props: {},
  onLoad: function (options) {
	  var duixin = this;
	  duixin.getDangqianurl();//获取当前网址
    this.getWww();
	
    uni.setNavigationBarTitle({
      title: '我的圈子'
    });
	this.quanid = options.id;
	var keycode = uni.getStorageSync('keycode');
	duixin.keycode = keycode;
	var uid = uni.getStorageSync('memberuid');
	duixin.uid = uid;
	this.getQuanList();


  },
  onShow: function () {
	  // 暗黑模式
	  var duixin = this;
	  var initialThemes = uni.getStorageSync('theme');
	  duixin.fenggeyanse = initialThemes;
	  uni.setNavigationBarColor({
	  	backgroundColor: this.fenggeyanse =='light'? '#ffffff':'#151515',
	  	frontColor: this.fenggeyanse =='light'? '#000000':'#ffffff',
	  })
  },
  onShareAppMessage: function () {
    return {
      title: '分享“' + config.getWebsiteName + '”圈子.',
      path: 'pages/quanzi/quanzi?id='+this.quanid,
      success: function (res) {// 转发成功
      },
      fail: function (res) {// 转发失败
      }
    };
  },
  methods: {
	//获取站点
	getWww() {
	  	var self = this;
	  	self.setData({
	  	  www: []
	  	});
	  	var getTubiaoRequest = wxRequest.getRequest(Api.getWwwUrl());
	  	getTubiaoRequest.then(response => {
	  		if (response.data.code == 1) {
	  		  //console.log(response.data.data); 
	  		  self.www = response.data.data
	  		} else {
	  		  self.setData({
	  			displaySwiper: "none"
	  		  });
	  		}
	  	});
	},
	//获取圈子列表
	getQuanList() {
	  	var duixin = this;
		if(duixin.tiezileixingquan ==2){
			var jiaru = '2';
		} else {
			var jiaru = '';
		}
	  	var getJiaruQuanlistUrlRequest = wxRequest.getRequest(Api.getJiaruQuanlistUrl()+'&uid='+duixin.uid+'&jiaru='+jiaru);
	  	getJiaruQuanlistUrlRequest.then(response => {
	  		if (response.data.code == 1) {
	  		  //console.log(response.data.data); 
	  		  duixin.quanlist = response.data.data
	  		} else {
	  		  duixin.setData({
	  			displaySwiper: "none"
	  		  });
	  		}
	  	});
	},

    reloadData: function (id) {
      var self = this;
      var newCategoriesList = [];
      var categoriesList = self.categoriesList;

      for (var i = 0; i < categoriesList.length; i++) {
        if (categoriesList[i].id == id) {}

        newCategoriesList.push(categoriesList[i]);
      }

      if (newCategoriesList.length > 0) {
        self.setData({
          categoriesList: newCategoriesList
        });
      }
    },
    //跳转至某分类下的文章列表
    redictIndex: function (e) {
      //console.log('查看某类别下的文章');  
      var id = e.currentTarget.dataset.id;
      var name = e.currentTarget.dataset.item;
      var url = '../list/list?categoryID=' + id;
      uni.navigateTo({
        url: url
      });
    },
	// 点击
	quanzi(tieid) {
		//console.log('点击',tieid); 
		var url = '../quanzi/quanzi?&id='+tieid;
		uni.navigateTo({
			url: url
		});
	},
	//展示不同的页面
	yemian(e){
		var duixin = this;
		duixin.tiezileixingquan = e.index;
		if(e.index == 1){
			uni.redirectTo({
				url: '/pages/quanzi/wode'
			});
		}
		if(e.index == 2){
			uni.redirectTo({
				url: '/pages/quanzi/wojiaruquan'
			});
		}
	},
	//获取当前页面
	getDangqianurl() {
		//获取当前页面栈的实例
		let pages = getCurrentPages();
		//获取当前页面
		let currentPage = pages[pages.length-1].$page.fullPath;
		let url = currentPage;
		uni.setStorageSync('dangqianUrl', url);
	},
	jiaru(){
		uni.switchTab({
			url: '/pages/quan/quan'
		});
	},
	chuangjian(){
		uni.showToast({
		    title: '即将开通...',
		    icon: 'none',
		    duration: 1000
		});
	}
  }
};
</script>
<style lang="scss">
@import "./quan.css";
page {
	background-color: #f3f4f7;
}
</style>